<template>
  <div class="editEvent">
    <el-dialog
      title="编辑活动"
      :close-on-click-modal="false"
      :close-on-press-escape="false"
      :modal-append-to-body="false"
      :visible.sync="isVisible"
      width="60%"
      @close="closeDialog"
      center
    >
      <el-form
        :model="formdata"
        :rules="rules"
        ref="formdata"
        class="demo-ruleForm"
        label-width="100px"
      >
        <el-form-item label="选择游戏" prop="game_id">
          <el-select
            v-model="formdata.game_id"
            placeholder="输入游戏名搜索"
            filterable
          >
            <el-option
              v-for="item in options"
              :key="item.id"
              :label="item.gameName"
              :value="item.id"
            ></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="活动名称" prop="name">
          <el-input
            type="text"
            placeholder="输入活动名称，比如周末累充活动"
            v-model="formdata.name"
            maxlength="50"
            show-word-limit
            autocomplete="off"
            class="name"
          ></el-input>
        </el-form-item>
        <el-form-item label="活动类型" prop="type">
          <el-radio-group v-model="formdata.type" @change="changeType">
            <el-radio :label="1">单日累充</el-radio>
            <el-radio :label="2">多日累充</el-radio>
            <el-radio :label="3">单笔充值</el-radio>
            <el-radio :label="4">高额返利</el-radio>
            <el-radio :label="5">其他类型</el-radio>
          </el-radio-group>
          <span class="typeText">注：每次切换活动类型会重置所有内容</span>
        </el-form-item>
        <el-form-item
          label="活动时间"
          prop="valid_type"
          class="valid_type"
          required
        >
          <el-radio-group
            v-model="formdata.valid_type"
            v-if="formdata.type != 4"
          >
            <el-radio :label="1">限时</el-radio>
            <el-radio :label="2">永久</el-radio>
          </el-radio-group>
          <div>
            <div style="display: inline-block">
              <el-form-item prop="start_time">
                <el-date-picker
                  v-model="formdata.start_time"
                  type="date"
                  placeholder="开始日期"
                  value-format="yyyy/MM/dd"
                  prefix-icon="el-icon-date"
                  :picker-options="validStartOptions"
                ></el-date-picker>
              </el-form-item>
            </div>
            <div
              style="display: inline-block; margin: 0 10px"
              v-if="formdata.valid_type == 1"
            >
              -
            </div>
            <div style="display: inline-block" v-if="formdata.valid_type == 1">
              <el-form-item prop="end_time">
                <el-date-picker
                  v-model="formdata.end_time"
                  type="date"
                  placeholder="结束日期"
                  value-format="yyyy/MM/dd"
                  prefix-icon="el-icon-date"
                  :picker-options="validEndOptions"
                ></el-date-picker>
              </el-form-item>
            </div>
          </div>
        </el-form-item>
        <el-form-item
          label="申请时间"
          prop="apply_time_type"
          v-if="formdata.valid_type == 1 && formdata.type != 5"
        >
          <el-select
            v-model="formdata.apply_time_type"
            placeholder="选择申请时间"
            filterable
            class="time"
          >
            <el-option
              v-for="item in timeOption"
              :key="item.id"
              :label="item.label"
              :value="item.id"
            ></el-option>
          </el-select>
          <span style="color: #f00; font-size: 13px"
            >说明：用于控制玩家在活动结束后N天内可以申请活动，逾期不可申请</span
          >
        </el-form-item>
        <el-form-item
          label="申请方式"
          prop="rebate_given_type"
          v-if="formdata.type == 4"
        >
          <el-radio-group v-model="formdata.rebate_given_type">
            <el-radio :label="1">自动发放</el-radio>
            <el-radio :label="2">手动申请</el-radio>
          </el-radio-group>
        </el-form-item>
        <el-form-item
          label="申请规则"
          prop="apply_rule"
          v-if="formdata.type == 1"
        >
          <el-select
            v-model="formdata.apply_rule"
            placeholder="选择申请时间"
            filterable
            class="rule"
          >
            <el-option
              v-for="item in ruleOption"
              :key="item.id"
              :label="item.label"
              :value="item.id"
            ></el-option>
          </el-select>
        </el-form-item>
        <el-form-item
          label="申请规则"
          prop="apply_rule"
          v-if="formdata.type == 2"
        >
          <el-select
            v-model="formdata.apply_rule"
            placeholder="选择申请时间"
            filterable
            class="rule"
          >
            <el-option
              v-for="item in rulesOption"
              :key="item.id"
              :label="item.label"
              :value="item.id"
            ></el-option>
          </el-select>
        </el-form-item>
        <el-form-item
          label="申请规则"
          prop="apply_times"
          v-if="formdata.type == 3"
        >
          <div style="font-size: 13px; font-weight: 600">
            每天每档可申请次数
          </div>
          <el-radio-group v-model="formdata.apply_times" @change="changeTimes">
            <el-radio :label="0">不限</el-radio>
            <el-radio :label="1">可申请</el-radio>
          </el-radio-group>
          <div style="display: inline-block">
            <el-input
              type="number"
              placeholder
              v-model="formdata.types"
              autocomplete="off"
              class="ruleNum"
              :disabled="selectFlag"
              oninput="value=value.replace(/[^\d]/g,'')"
              onkeyup="this.value=this.value.replace(/\D|^0/g,'')"
              onafterpaste="this.value=this.value.replace(/\D|^0/g,'')"
            ></el-input>
            <span>次</span>
          </div>
        </el-form-item>
        <el-form-item
          label="发放时间"
          prop="given_time_type"
          v-if="formdata.type <= 3"
        >
          <el-select
            v-model="formdata.given_time_type"
            placeholder="选择申请时间"
            filterable
            class
          >
            <el-option
              v-for="item in sendTimeOption"
              :key="item.id"
              :label="item.label"
              :value="item.id"
            ></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="活动说明" prop="desc" v-if="formdata.type <= 3">
          <el-input
            v-model="formdata.desc"
            placeholder="请输入注意事项、活动规则、特殊情况描述等，文案尽可能精简，不能大于800字"
            type="textarea"
            maxlength="800"
            show-word-limit
          ></el-input>
        </el-form-item>
        <el-form-item
          label="返利货币"
          prop="rebate_currency"
          v-if="formdata.type == 4"
        >
          <el-input
            v-model="formdata.rebate_currency"
            placeholder="只限输入货币名称，如“元宝”"
            type="text"
            maxlength="10"
            show-word-limit
          ></el-input>
        </el-form-item>
        <el-form-item label="返利说明" prop="desc" v-if="formdata.type == 4">
          <el-input
            v-model="formdata.desc"
            placeholder="请输入注意事项、返利规则、特殊情况描述等，文案尽可能精简，不能大于800字"
            type="textarea"
            maxlength="800"
            show-word-limit
          ></el-input>
        </el-form-item>
        <el-form-item
          label="活动内容"
          required
          v-if="formdata.type <= 3"
          prop=""
        >
          <el-card
            class="box-card"
            shadow="never"
            v-for="(item, index) in formdata.activity_stage_str"
            :key="index"
          >
            <el-button
              icon="el-icon-error"
              circle
              @click="deleteItem(item, index)"
              v-if="index != 0"
            ></el-button>
            <el-form-item
              :label="label"
              :prop="`activity_stage_str[${index}].amount`"
              :rules="{
                required: true,
                message: '输入框不能为空',
                trigger: 'blur',
              }"
            >
              <el-input
                type="number"
                placeholder
                v-model="formdata.activity_stage_str[index].amount"
                autocomplete="off"
                class="oddDay"
                oninput="value=value.replace(/[^\d]/g,'')"
                onkeyup="this.value=this.value.replace(/\D|^0/g,'')"
                onafterpaste="this.value=this.value.replace(/\D|^0/g,'')"
              ></el-input>
              <span>元</span>
            </el-form-item>
            <el-form-item label="申请方式" required>
              <el-radio-group
                :disabled="applyFlag[index]"
                v-model="formdata.activity_stage_str[index].apply_type"
              >
                <el-radio :label="1">自动发放</el-radio>
                <el-radio :label="2">手动申请</el-radio>
              </el-radio-group>
            </el-form-item>
            <el-form-item label="奖励选择" required>
              <el-radio-group
                v-model="formdata.activity_stage_str[index].prize_type"
                @change="chooseChange(index, $event)"
              >
                <el-radio :label="1">固定</el-radio>
                <el-radio :label="2">任选</el-radio>
              </el-radio-group>
              <div
                style="display: inline-block"
                v-if="formdata.activity_stage_str[index].prize_type == 2"
              >
                <el-input
                  type="number"
                  placeholder
                  v-model="formdata.activity_stage_str[index].prize_num"
                  autocomplete="off"
                  class="oddDay"
                  oninput="value=value.replace(/[^\d]/g,'')"
                  onkeyup="this.value=this.value.replace(/\D|^0/g,'')"
                  onafterpaste="this.value=this.value.replace(/\D|^0/g,'')"
                ></el-input>
                <span>个</span>
              </div>
            </el-form-item>
            <el-form-item
              label="奖励内容"
              :prop="`activity_stage_str[${index}].prize_content[0]`"
              :rules="{
                required: true,
                message: '输入框不能为空',
                trigger: 'blur',
              }"
            >
              <el-input
                v-model="formdata.activity_stage_str[index].prize_content[0]"
                placeholder="仅限填写奖励的内容描述，不要填写其他非奖励相关的描述"
                type="textarea"
                show-word-limit
                maxlength="800"
                v-if="formdata.activity_stage_str[index].prize_type == 1"
              ></el-input>
              <div
                class="selectWay"
                v-if="formdata.activity_stage_str[index].prize_type == 2"
              >
                <el-form-item
                  class="selectItem"
                  v-for="(item, index1) in formdata.activity_stage_str[index]
                    .prize_content"
                  :key="index1"
                  :prop="`activity_stage_str[${index}].prize_content[${index1}]`"
                  :rules="{
                    required: true,
                    message: '输入框不能为空',
                    trigger: 'blur',
                  }"
                >
                  <el-input
                    v-model="
                      formdata.activity_stage_str[index].prize_content[index1]
                    "
                    placeholder="每个框输入一项奖励内容描述，多档系统自带序号无需手动填写"
                    type="text"
                    show-word-limit
                    maxlength="800"
                  ></el-input>
                  <el-button
                    icon="el-icon-circle-plus"
                    circle
                    @click="addPlus(index)"
                    v-if="index1 == 0"
                  ></el-button>
                  <el-button
                    icon="el-icon-error"
                    circle
                    @click="deleteInput(index, index1)"
                    v-if="index1 != 0"
                  ></el-button>
                </el-form-item>
              </div>
            </el-form-item>
            <el-form-item label="发放方式" class="sendway" required>
              <el-radio-group
                v-model="formdata.activity_stage_str[index].given_type"
              >
                <el-radio :label="1">邮件发放</el-radio>
                <el-radio :label="2">游戏到账</el-radio>
                <el-radio :label="3">CDK</el-radio>
              </el-radio-group>
            </el-form-item>
            <el-form-item
              :prop="`activity_stage_str[${index}].cdk_desc`"
              :rules="{
                required: true,
                message: '输入框不能为空',
                trigger: 'blur',
              }"
              v-if="formdata.activity_stage_str[index].given_type == 3"
            >
              <el-input
                v-model="formdata.activity_stage_str[index].cdk_desc"
                placeholder="请输入CDK兑换方式，如福利大厅-CDK兑换"
                type="text"
                show-word-limit
                maxlength="50"
                class="cdk"
              ></el-input>
            </el-form-item>
          </el-card>
        </el-form-item>
        <el-form-item :label="label1" prop="content" v-if="formdata.type >= 4">
          <quill-editor
            v-model="formdata.content"
            ref="myQuillEditor"
            :options="editorOption"
            @blur="onEditorBlur($event)"
            @focus="onEditorFocus($event)"
            @change="onEditorChange($event)"
          ></quill-editor>
          <el-upload
            class="avatar-uploader"
            :action="action"
            :data="data"
            multiple
            :show-file-list="false"
            :on-success="uploadSuccess"
            :on-error="uploadError"
            :before-upload="beforeUpload"
            accept=".png, .jpg, .jpeg"
          ></el-upload>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button
          type="primary"
          @click="addItem"
          v-if="formdata.type == 1 || formdata.type == 2 || formdata.type == 3"
          >增加档位</el-button
        >
        <el-button type="primary" @click="editevent('formdata')"
          >确认修改</el-button
        >
        <el-button @click="isVisible = false">取消修改</el-button>
      </div>
    </el-dialog>
  </div>
</template>
<script>
import "quill/dist/quill.core.css";
import "quill/dist/quill.snow.css";
import "quill/dist/quill.bubble.css";
// import Quill from "quill";
import { quillEditor,Quill } from "vue-quill-editor";
import { container, ImageExtend } from "quill-image-extend-module";
Quill.register("modules/ImageExtend", ImageExtend);

import { getAndroidList } from "@/api/gameManage";
import { editEvent } from "@/api/eventManage";

export default {
  inject: ["reload"],
  data() {
    return {
      isVisible: this.isShow,
      formdata: {
        game_id: "",
        name: "",
        type: 1,
        valid_type: 1,
        start_time: "",
        end_time: "",
        apply_time_type: 1,
        apply_rule: 1,
        apply_times: 0,
        types: 1,
        rebate_currency: "",
        given_time_type: 1,
        desc: "",
        rebate_given_type: 1,
        content: "",
        status: "",
        activity_stage_str: [
          {
            amount: "",
            apply_type: 2,
            prize_type: 1,
            prize_num: 1,
            prize_content: [""],
            given_type: 1,
            cdk_desc: "",
          },
        ],
      },
      label: "单日累充",
      label1: "返利说明",
      applyFlag: [false],
      selectFlag: true,
      rules: {
        name: [{ required: true, message: "请输入资讯名称", trigger: "blur" }],
        type: [{ required: true, message: "请输入资讯类型", trigger: "blur" }],
        game_id: [
          { required: true, message: "请选择关联游戏", trigger: "blur" },
        ],
        valid_type: [
          { required: true, message: "请选择活动时间", trigger: "blur" },
        ],
        start_time: [
          { required: true, message: "请选择开始时间", trigger: "blur" },
        ],
        end_time: [
          { required: true, message: "请选择结束时间", trigger: "blur" },
        ],
        apply_time_type: [
          { required: true, message: "请选择申请时间", trigger: "blur" },
        ],
        apply_rule: [
          { required: true, message: "请选择申请规则", trigger: "blur" },
        ],
        apply_times: [
          { required: true, message: "请选择申请规则", trigger: "blur" },
        ],
        types: [{ required: true, message: "请选择申请规则", trigger: "blur" }],
        rebate_given_type: [
          { required: true, message: "请选择发放方式", trigger: "blur" },
        ],
        rebate_currency: [
          { required: true, message: "请输入返利货币", trigger: "blur" },
        ],
        desc: [{ required: true, message: "输入框不能为空", trigger: "blur" }],
        given_time_type: [
          { required: true, message: "请选择发放时间", trigger: "blur" },
        ],
        content: [
          { required: true, message: "请选择发放时间", trigger: "blur" },
        ],
      },
      options: [],
      timeOption: [
        {
          id: 1,
          label: "永久",
        },
        {
          id: 2,
          label: "15天",
        },
        {
          id: 3,
          label: "30天",
        },
      ],
      ruleOption: [
        {
          id: 2,
          label: "每天每档只可申请一次（满足高档位可同时申请低档位）",
        },
        {
          id: 1,
          label: "每天所有档位仅能选择一档申请一次",
        },
      ],
      rulesOption: [
        {
          id: 2,
          label: "活动期间每档只可申请一次（满足高档位可同时申请低档位）",
        },
        {
          id: 1,
          label: "活动期间所有档位仅能选择一档申请一次",
        },
      ],
      sendTimeOption: [
        {
          id: 1,
          label: "申请后次日0点发放",
        },
        {
          id: 2,
          label: "申请后24小时内发放",
        },
        {
          id: 3,
          label: "申请后48小时内发放",
        },
        {
          id: 4,
          label: "活动结束后24小时内发放",
        },
        {
          id: 5,
          label: "活动结束后48小时内发放",
        },
      ],
      timeFlag: true,
      validStartOptions: {
        disabledDate: (time) => {
          // return time.getTime() < Date.now() - 8.64e7;
        },
      },
      validEndOptions: {
        disabledDate: (time) => {
          let delay = this.formdata.start_time;
          if (delay) {
            return time.getTime() < new Date(delay).getTime() - 8.64e7;
          } else {
            return true;
          }
        },
      },
      // action: "/api/uploadFile",
      action: "https://cpop.zaoyx.com/api/v1/adminrebate/uploadFile",
      data: {
        fileType: "image",
      },
      editorOption: {
        modules: {
          ImageExtend: {
            loading: true,
            name: "file",
            action: "https://cpop.zaoyx.com/api/v1/adminrebate/uploadFile",
            response: (res) => {
              return res.data.previewUrl;
            },
          },
          toolbar: {
            // 工具栏
            container: [
              ["bold", "italic", "underline", "strike"],
              ["blockquote", "code-block"],
              [{ list: "ordered" }, { list: "bullet" }],
              [{ indent: "-1" }, { indent: "+1" }],
              [{ color: [] }, { background: [] }],
              [{ align: [] }],
              ["image"],
              ["clean"],
              [{ size: ["small", false, "large", "huge"] }],
              [{ header: [1, 2, 3, 4, 5, 6, false] }],
              [{ font: [] }],
            ],
            handlers: {
              image: function (value) {
                if (value) {
                  document.querySelector(".avatar-uploader input").click();
                } else {
                  this.quill.format("image", false);
                }
              },
            },
          },
        },
        placeholder: "输入内容...",
      },
    };
  },
  components: {
    quillEditor,
  },
  props: {
    isShow: Boolean,
    dialogRow: Object,
  },
  computed: {
    editor() {
      return this.$refs.myQuillEditor.quill;
    },
  },
  mounted() {
    getAndroidList().then((res) => {
      this.options = res.data.list;
    });
    this.formdata = Object.assign({}, this.dialogRow);
    if (this.formdata.end_time == 0) {
      this.formdata.end_time = "";
    }
    if (this.formdata.activity_stage_str.length > 0) {
      this.formdata.activity_stage_str.forEach((item) => {
        delete item.activity_id;
      });
    }
    if (this.formdata.apply_times != 0) {
      this.$set(this.formdata, "types", this.dialogRow.apply_times);
      this.formdata.apply_times = 1;
      this.selectFlag = false;
    }
    if (this.formdata.type == 1) {
      this.label = "单日累充";
    } else if (this.formdata.type == 2) {
      this.label = "活动期间累充";
    } else if (this.formdata.type == 3) {
      this.label = "单笔充值";
    } else if (this.formdata.type == 4) {
      this.label1 = "返利内容";
    } else if (this.formdata.type == 5) {
      this.label1 = "活动内容";
    }
  },
  methods: {
    // 确认修改
    editevent(formName) {
      this.$refs[formName].validate((valid) => {
        if (valid) {
          const para = Object.assign({}, this.formdata);
          para.status = 2;
          if (para.activity_stage_str.prize_type == 1) {
            para.activity_stage_str.prize_num = "";
          }
          if (para.apply_times != 0) {
            para.apply_times = para.types;
          }
          var submitFlag = false; //判断任选个数小于内容长度
          // 判断档位金额是否有相同金额
          var amountFlag = true;
          // 判断档位任选内容是否一致
          var chooseFlag = true;

          para.activity_stage_str.forEach((item, index) => {
            if (
              item.prize_content.length <= parseInt(item.prize_num) &&
              item.prize_type == 2
            ) {
              submitFlag = true;
            } else {
              submitFlag = false;
            }

            if (item.prize_content.length >= 2 && item.prize_type == 2) {
              //第一次遍历数组
              for (var i = 0; i < item.prize_content.length; i++) {
                for (var j = i + 1; j < item.prize_content.length; j++) {
                  if (item.prize_content[i] == item.prize_content[j]) {
                    chooseFlag = false;
                    i--;
                    j--;
                    return;
                  }
                }
              }
            }
          });
          var ary = para.activity_stage_str;
          var nary = ary.sort();
          for (var i = 0; i < nary.length - 1; i++) {
            if (nary[i].amount == nary[i + 1].amount) {
              amountFlag = false;
            }
          }
          delete para.types;
          para.activity_id = para.id;
          // 任选个数小于内容长度
          if (submitFlag == true) {
            this.$message.error("奖励内容数量必须大于任选数量");
          } else {
            if (amountFlag) {
              if (chooseFlag == true) {
                editEvent(para).then((res) => {
                  if (res.code == 200) {
                    this.$message.success(res.msg);
                    setTimeout(() => {
                      this.reload();
                    }, 20);
                    this.isVisible = false;
                  }
                });
              } else {
                this.$message.error("有任选项包含相同内容，请确认后再提交");
              }
            } else {
              this.$message.error("检测到多个档位金额重复，请检查后再提交");
            }
          }
        } else {
          this.$message({
            message: "部分内容未编辑，请检查并编辑",
            type: "error",
          });
        }
      });
    },
    closeDialog() {
      this.$emit("closeDialog");
    },
    // 增加奖励内容
    addPlus(index) {
      this.formdata.activity_stage_str[index].prize_content.push("");
    },
    deleteInput(index, index1) {
      this.formdata.activity_stage_str[index].prize_content.splice(index1, 1);
    },
    // 新增档位
    addItem() {
      this.formdata.activity_stage_str.push({
        amount: "",
        apply_type: 2,
        prize_type: 1,
        prize_num: "",
        prize_content: [""],
        given_type: 1,
        cdk_desc: "",
      });
      this.applyFlag.push(false);
    },
    deleteItem(item, index) {
      this.$confirm("确定要删除此档内容吗?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {
          this.formdata.activity_stage_str.splice(index, 1);
          this.$message({
            type: "success",
            message: "删除成功!",
          });
          this.applyFlag.splice(index, 1);
        })
        .catch(() => {
          this.$message({
            type: "info",
            message: "已取消删除",
          });
        });
    },
    changeType(value) {
      if (value == 1) {
        this.label = "单日累充";
      } else if (value == 2) {
        this.label = "活动期间累充";
      } else if (value == 3) {
        this.label = "单笔充值";
      } else if (value == 4) {
        this.label1 = "返利内容";
      } else if (value == 5) {
        this.label1 = "活动内容";
      }
      var copydata = Object.assign({}, this.formdata);
      if (this.$refs.formdata !== undefined) {
        this.$refs.formdata.resetFields(); //重置表单
      }
      this.formdata = {
        id: this.formdata.id,
        game_id: this.formdata.game_id,
        name: this.formdata.name,
        type: value,
        valid_type: 1,
        start_time: "",
        end_time: "",
        apply_time_type: 1,
        apply_rule: 2,
        apply_times: 0,
        types: 1,
        rebate_currency: "",
        given_time_type: 1,
        desc: "",
        rebate_given_type: 1,
        content: "",
        status: "",
        activity_stage_str: [
          {
            amount: "",
            apply_type: 2,
            prize_type: 1,
            prize_num: 1,
            prize_content: [""],
            given_type: 1,
            cdk_desc: "",
          },
        ],
      };
      this.applyFlag[0] = false;
    },
    onEditorBlur() {}, // 失去焦点事件
    onEditorFocus() {}, // 获得焦点事件
    onEditorChange() {}, // 内容改变事件
    uploadSuccess(file, fileList) {
      let quill = this.$refs.myQuillEditor.quill;
      // 获取光标所在位置
      let length = quill.getSelection().index;
      // 插入图片  file.previewUrl为服务器返回的图片地址
      quill.insertEmbed(length, "image", file.data.previewUrl);
      // 调整光标到最后
      quill.setSelection(length + 1);

      // loading加载隐藏
      this.quillUpdateImg = false;
    }, //上传成功
    uploadError() {}, //上传失败
    beforeUpload(file) {
      if (file.type.indexOf("image") < 0) {
        this.$message.error("上传图片只能是JPG或PNG格式");
        return false;
      }
    }, //上传前
    chooseChange(index, event) {
      this.formdata.activity_stage_str[index].prize_num = 1;
      this.formdata.activity_stage_str[index].prize_content = [""];
      if (event == 2) {
        this.applyFlag[index] = true;
        this.formdata.activity_stage_str[index].apply_type = 2;
      } else {
        this.applyFlag[index] = false;
      }
    },
    changeTimes(value) {
      if (value == 1) {
        this.selectFlag = false;
      } else {
        this.selectFlag = true;
      }
    },
  },
};
</script>
<style lang="scss">
.editEvent {
  .typeText {
    position: absolute;
    left: 0;
    top: 25px;
    color: #f00;
  }
  .name {
    .el-input__suffix {
      right: -48px;
    }
  }
  .el-dialog__headerbtn {
    font-size: 35px;
  }
  /* 编辑器内部出现滚动条 */
  .el-dialog {
    margin-top: 2vh !important;
    // height: 95%;
    // overflow-y: scroll;
  }
  .ql-container {
    overflow-y: auto;
    height: 300px;
  }
  .el-radio__label {
    font-size: 13px;
  }
  .el-dialog__wrapper .el-input.is-disabled .el-input__inner {
    color: #a5a4bf !important;
  }
  .el-input {
    width: 300px;
  }
  .ruleNum.el-input {
    width: 80px !important;
  }
  .el-select .el-input {
    width: 220px;
  }
  .time .el-input {
    width: 80px;
    margin-right: 10px;
  }
  .rule .el-input {
    width: 340px;
  }
  .selectWay .el-input,
  .cdk.el-input {
    width: 450px;
  }
  .el-form-item__label {
    padding: 0 10px;
    text-align: left;
  }
  .el-form-item__content {
    margin-bottom: 15px;

    .el-input__inner,
    .el-radio__inner,
    .el-textarea__inner {
      color: #a5a4bf;
      border: 1px solid #a5a4bf;
    }
    .el-textarea {
      font-size: 13px;
    }
    .el-input__inner::placeholder,
    .el-textarea__inner::placeholder {
      color: #a5a4bf;
    }
  }
  .valid_type {
    .el-form-item__content {
      margin-bottom: 10px;
    }
  }
  .el-dialog__wrapper .el-input.is-disabled .el-input__inner {
    border: 1px solid #a5a4bf;
    background-color: #f5f7fa;
    cursor: not-allowed;
  }
  .edui-default .edui-toolbar .edui-button .edui-button-wrap,
  .edui-default .edui-toolbar .edui-combox .edui-combox-body {
    height: 20px;
  }
  .edui-default .edui-toolbar {
    line-height: 30px;
  }
  .el-date-editor.el-input {
    width: 180px !important;
  }
  .el-textarea__inner,
  .el-textarea {
    width: 520px;
    height: 132px;
  }
  .el-textarea__inner {
    resize: none;
  }
  .el-input__count {
    right: -55px;
    bottom: 0px;
  }
  .box-card {
    width: 650px;
    padding: 20px 0;
    margin-top: 20px;
  }
  .el-card__body {
    padding: 0 20px 0 0;
  }
  .el-card {
    background: #ebeef5;
    position: relative;
    .el-input__count {
      right: 0px;
      bottom: -32px;
      background: transparent;
    }
    .el-input .el-input__count .el-input__count-inner {
      padding: 0;
    }
    .el-button.is-circle {
      right: 20px;
      top: 20px;
      position: absolute;
      padding: 0;
      border: 0;
      background: transparent;
      z-index: 10;
    }
    .el-icon-error:before,
    .el-icon-circle-plus::before {
      font-size: 22px;
    }
    .el-form-item__label {
      width: 110px !important;
    }
    .el-form-item__content {
      margin-left: 110px !important;
    }
    .selectItem {
      .el-form-item__content {
        margin-left: 0 !important;
      }
    }
    .oddDay {
      width: 80px;
      margin-right: 5px;
    }
  }
  .selectItem {
    position: relative;
    .el-button.is-circle {
      right: 45px;
      top: 10px;
      position: absolute;
      padding: 0;
      border: 0;
      background: transparent;
    }
  }
  .sendway .el-form-item__content {
    margin-bottom: 0;
  }
  .el-dialog__wrapper {
    //   overflow: hidden;
  }
  .el-dialog__footer {
    padding-bottom: 40px;
    .el-button {
      padding: 10px 20px;
      font-size: 13px;
    }
  }
  input::-webkit-inner-spin-button {
    display: none;
  }
}
</style>
